在 HTML 中，區塊元素提供了結構化內容的能力，讓我們能夠更清晰地組織網頁的各個部分。

以下是常用的區塊元素及其用途：
1. <header> 標籤
<header> 標籤用於製作網頁的頁首，通常包含網站的標題、標誌和導航連結。這是一個用來引導用戶進入網站的部分。

<header>
    <h1>我的網站</h1>
    <nav>
        <ul>
            <li><a href="#home">首頁</a></li>
            <li><a href="#about">關於我們</a></li>
            <li><a href="#contact">聯絡我們</a></li>
        </ul>
    </nav>
</header>

2. <nav> 標籤
<nav> 標籤用於製作導覽列選單，幫助用戶在網站內部快速找到所需內容。

<nav>
    <ul>
        <li><a href="#home">首頁</a></li>
        <li><a href="#services">服務</a></li>
        <li><a href="#contact">聯絡我們</a></li>
    </ul>
</nav>

3. <article> 標籤
<article> 標籤用來表示獨立的內容或報導，通常是可以獨立發佈和理解的部分。

<article>
    <h2>最新消息</h2>
    <p>這裡是關於我們最新活動的內容...</p>
</article>

4. <section> 標籤
<section> 標籤用於將主題相關的內容分組，通常會包含標題和相關內容。

<section>
    <h2>我們的服務</h2>
    <p>這裡介紹我們提供的各種服務...</p>
</section>

5. <main> 標籤
<main> 標籤用於標記網頁的主要內容，這部分內容是該頁面最重要的內容。

<main>
    <h1>歡迎來到我們的網站</h1>
    <p>這裡是網站的主要介紹...</p>
</main>

6. <aside> 標籤
<aside> 標籤用於補充非主要內容，通常用於側邊欄或附加資訊。

<aside>
    <h2>相關資訊</h2>
    <p>這裡有一些有趣的連結或資訊...</p>
</aside>

7. <footer> 標籤
<footer> 標籤用於製作網頁的頁尾，通常包含版權資訊、聯絡資訊或社交媒體連結。

<footer>
    <p>&copy; 2024 我的網站. 版權所有。</p>
</footer>

8. <div> 標籤
   <div> 標籤是一個通用的區塊元素，無特定意義，可用於將內容分組或應用樣式。

<div class="container">
    <h2>容器標題</h2>
    <p>這裡的內容可以進一步分組或樣式化...</p>
</div>

透過這些區塊元素的使用，使用者能夠清晰地結構化網頁內容，使其易於理解和導航。這不僅提高了用戶體驗，也有助於搜索引擎優化（SEO），讓搜尋引擎更容易索引我們的內容。